<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=600, initial-scale=1, shrink-to-fit=no">
    <title>山长项目</title>
    <link rel="icon" href="./favicon.ico" type="image/x-icon"> 
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/common.css"> 
    <link rel="stylesheet" href="./css/announce.css">
</head>

<body>
    <div id="home" v-cloak>
        <!-- 头部title -->
        <div class="container">
            <header class="head_top row">
                <div class="col">
                    <h1 class="head_top_tit">山长综合信息管理平台</h1>
                </div>
                <div class="col search">
                    <input class="head_top_inp fr" maxlength="10" type="text" placeholder="请输入关键字" v-model.trim="keyWords"  
                    @keyup.enter="goDetails"/>
                    <img class="search_img" src="./image/search@2x.png" alt=""  @click="goDetails"/> 
                </div>
            </header>
        </div>
        <!-- 头部导航栏 -->
        <div class="container-fluid nav_back">
            <div class="container">
                <div class="head_nav">
                    <nav class="nav nav-pills nav-justified" id="head_nav">
                          <!-- target="_blank" 新窗口打开 -->
                          <a class="flex-sm-fill text-sm-center nav-link" :class="item.id == 2? 'actives':''" 
                          v-for="item in headNav" :key="item.id" :href="item.url">
                          {{item.text}}</a> 
                    </nav>
                </div>
            </div>
        </div> 
        <!-- 中间展示图 -->
        <div class="container-fluid">
            <div class="con_banner"> </div>
        </div> 
        <!-- 中间内容区 -->
        <div class="container-fluid">
            <div class="container">
              <div class="announce">
                  <!-- 面包屑 -->
                <div class="crumbs">
                    <img class="add_img" src="./image/add@2x.png" alt="">
                    <span>首页</span>
                    <img class="point_img" src="./image/point@2x.png" alt="">
                    <span>通知公告</span>
                </div> 
                <ul class="ann_content">
                    <li class="ann_content_item row">
                        <div class="col-3 ann_content_fl">
                            <img src="./image/tutu@2x.png" alt="">
                        </div>
                        <ul class="col-9 ann_content_fr" style="padding-left: 60px">
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                        </ul>
                    </li> 

                    <li class="ann_content_item row">
                        
                        <ul class="col-9 ann_content_fr" style="padding-right: 60px">
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                        </ul>
                        <div class="col-3 ann_content_fl">
                            <img src="./image/tutu@2x.png" alt="">
                        </div>
                    </li> 

                    <li class="ann_content_item row"> 
                        <ul class="col-9 ann_content_fr" style="padding-right: 60px">
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                            <li class="content_fr_item row">
                                <p class="col">党政领导干部选拔任用条例</p>
                                <span class="ml-auto">2020.09.06  16:09</span>
                            </li>
                        </ul>
                        <div class="col-3 ann_content_fl">
                            <img src="./image/tutu@2x.png" alt="">
                        </div>
                    </li> 
                </ul>
                  <!-- 分页 -->
                  <div class="report_foo"> 
                    <ul class="nav">
                        <li class="nav_item">首页</li>
                        <li class="nav_item isShowNav">1</li>
                        <li class="nav_item">2</li>
                        <li class="nav_item">3</li>
                        <li class="nav_item">4</li> 
                        <li class="nav_item">...</li> 
                        <li class="nav_item">8</li>
                        <li class="nav_item">9</li>
                        <li class="nav_item">10</li>
                        <li class="nav_item">
                            下一页
                        </li>
                    </ul>
                </div>
              </div>
            </div>
        </div>
        <!-- 底部导航 -->
        <div class="container-fluid foo_nav_back">
            <div class="container">
                <div class="head_nav">
                    <nav class="nav nav-pills nav-justified" id="head_nav">
                          <!-- target="_blank" 新窗口打开 -->
                          <a class="flex-sm-fill text-sm-center nav-link" :class="item.id == 2? 'actives':''" 
                          v-for="item in headNav" :key="item.id" :href="item.url">
                          {{item.text}}</a> 
                    </nav>
                </div>
            </div>
        </div>
        <!-- 底部 -->
        <div class="container-fluid footerColumnBg">
            <div class="container">
                <footer class="footer">
                    <div class="footer_foo">
                        <h2 class="footer_tit">山长综合信息管理平台</h2>
 
                    </div>
                </footer>
            </div>
        </div>
        <!-- 返回顶部按钮 -->
        <div class="back_top disp_none">
            <img class="back_top_img" src="./image/top.jpg" alt="">
            <span>返回顶部</span>
        </div>
    </div> 
    <!-- vue -->
    <script src="./js/vue.js"></script> 
    <!-- vuex数据管理仓库 -->
    <script src="./js/vuex.js"></script> 
    <!-- vuex 数据仓库 -->
    <script src="./utils/store.js"></script>
    <!-- jq -->
    <script src="./js/jquery-3.5.1.min.js"></script>
    <!-- bt -->
    <script src="./js/bootstrap.min.js"></script>
    <!-- bootstrap 插件的js文件 -->
    <script src="./js/popper.min.js"></script>
    <!-- swiper js文件 -->
    <script src="./js/swiper-bundle.js"></script>
    <!-- axios请求 -->
    <script src="./js/axios.min.js"></script>
    <!-- http - axios 全局封装 -->
    <script src="./api/http.js"></script> 
    <!-- 轮播图 -->
    <script src="./js/swiper.js"></script>
    <!-- 全局js工具函数以公共js -->
    <script src="./utils/global.js"></script> 
    <!-- 请求 -->
    <script src="./api/api.js"></script> 
    <!-- 项目数据 -->
    <script src="./js/home.js"></script>
</body>

</html>